<template>
  <div class="row">
    <a-content-box
      v-for="instance in contents"
      :key="instance.id"
      :content="instance"
      :type="instance.type || type"
      class="col-xl-4 col-lg-4 col-md-6 col-sm-6 col-xs-12 q-pa-sm"></a-content-box>
  </div>
</template>

<script>
  import { mapState } from 'vuex'

  export default {
    name: 'aContentBoxes',
    props: {
      contents: {
        type: Array,
        required: true
      },
      type: {
        type: String,
        required: false,
        default: 'article'
      }
    },
    data () {
      return {
      }
    },
    computed: {
      ...mapState([
        'windowWidth'
      ])
    }
  }
</script>
